<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <base href="<%=basePath%>">
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>购买完成页面</title>
    <link rel="stylesheet" href="render/css/frontend/common/base.css" type="text/css"/>
    <link rel="stylesheet" href="render/css/frontend/common/shop_common.css" type="text/css"/>
    <link rel="stylesheet" href="render/css/frontend/shop_header.css" type="text/css"/>
    <link rel="stylesheet" href="render/css/frontend/shop_gouwuche.css" type="text/css"/>

    <style type="text/css">
        .shop_bd_shdz_title {
            width: 1000px;
            margin-top: 10px;
            height: 50px;
            line-height: 50px;
            overflow: hidden;
            background-color: #F8F8F8;
        }

        .shop_bd_shdz_title h3 {
            width: 120px;
            text-align: center;
            height: 40px;
            line-height: 40px;
            font-size: 14px;
            font-weight: bold;
            background: #FFF;
            border: 1px solid #E8E8E8;
            border-radius: 4px 4px 0 0;
            float: left;
            position: relative;
            top: 10px;
            left: 10px;
            border-bottom: none;
        }

        .shop_bd_shdz_title p {
            float: right;
        }

        .shop_bd_shdz_title p a {
            margin: 0 8px;
            color: #555555;
        }

        .shop_bd_shdz_lists {
            width: 1000px;
        }

        .shop_bd_shdz_lists ul {
            width: 1000px;
        }

        .shop_bd_shdz_lists ul li {
            width: 980px;
            border-radius: 3px;
            margin: 5px 0;
            padding-left: 18px;
            line-height: 40px;
            height: 40px;
            border: 1px solid #FFE580;
            background-color: #FFF5CC;
        }

        .shop_bd_shdz_lists ul li label {
            color: #626A73;
            font-weight: bold;
        }

        .shop_bd_shdz_lists ul li label span {
            padding: 10px;
        }

        .shop_bd_shdz_lists ul li em {
            margin: 0 4px;
            color: #626A73;
        }

        .shop_bd_shdz {
            width: 1000px;
            margin: 10px auto 0;
        }

        .shop_bd_shdz_new {
            border: 1px solid #ccc;
            width: 998px;
        }

        .shop_bd_shdz_new div.title {
            width: 990px;
            padding-left: 8px;
            line-height: 35px;
            height: 35px;
            border-bottom: 1px solid #ccc;
            background-color: #F2F2F2;
            font-color: #656565;
            font-weight: bold;
            font-size: 14px;
        }

        .shdz_new_form {
            width: 980px;
            padding: 9px;
        }

        .shdz_new_form ul {
            width: 100%;
        }

        .shdz_new_form ul li {
            clear: both;
            width: 100%;
            padding: 5px 0;
            height: 25px;
            line-height: 25px;
        }

        .shdz_new_form ul li label {
            float: left;
            width: 100px;
            text-align: right;
            padding-right: 10px;
        }

        .shdz_new_form ul li label span {
            color: #f00;
            font-weight: bold;
            font-size: 14px;
            position: relative;
            left: -3px;
            top: 2px;
        }

        .shop_gwc_bd_contents_lc ul li.hover_b{
            background-position: left -150px !important;
        }

        .shop_gwc_bd_contents_lc ul li.step_c {
            background-position: left -197px !important;
        }
    </style>

    <script type="text/javascript" src="render/js/jquery.min.js"></script>
</head>
<body>
<!-- Header Start -->
<jsp:include page="common/head.jsp"></jsp:include>

<!-- TopHeader Center -->
<jsp:include page="common/topheader_center.jsp"></jsp:include>
<!-- TopHeader Center End -->

<!-- Header Menu -->
<jsp:include page="common/header_menu.jsp"></jsp:include>
<!-- Header Menu End -->

<div class="shop_hd_breadcrumb">
    <strong>当前位置：</strong>
    <span>
        <a href="/">首页</a>&nbsp;›&nbsp;
        <a href="/render/myhome">个人中心</a>&nbsp;›&nbsp;
        <a href="javascript:void(0);">购买完成</a>
    </span>
</div>
<div class="clear"></div>
<!-- 面包屑 End -->
<!-- Header End -->

<!-- 购物车 Body Start -->
<form id="formaddress">
    <div class="shop_gwc_bd clearfix">
        <div class="shop_gwc_bd_contents clearfix">

            <!-- 购物流程导航 -->
            <div class="shop_gwc_bd_contents_lc clearfix">
                <ul>
                    <li class="step_a">确认购物清单</li>
                    <li class="step_b hover_b">确认收货人资料及送货方式</li>
                    <li class="step_c">购买完成</li>
                </ul>
            </div>
            <!-- 购物流程导航 End -->
            <div class="clear"></div>
            <!-- 收货地址 title -->
            <%--<div class="shop_bd_shdz_title">
                <h3>收货人地址</h3>
                <p>
                    <a href="javasrcipt:void(0);" id="new_add_shdz_btn">新增收货地址</a>
                    <a href="render/address">管理收货地址</a>
                </p>
            </div>--%>

            <!-- 收货人地址 Title End -->
            <div class="shop_bd_shdz clearfix">
                <div class="shop_bd_shdz_lists clearfix">
                    <ul id="address">
                    </ul>
                </div>
                <!-- 新增收货地址 -->
                <%--<div id="new_add_shdz_contents" style="display:none;" class="shop_bd_shdz_new clearfix">
                    <div class="title">新增收货地址</div>
                    <div class="shdz_new_form">
                        <ul>
                            <li>
                                <label><span>*</span>收货人姓名：</label>
                                <input name="name" type="text" class="name"/>
                            </li>
                            <li>
                                <label><span>*</span>所在地址：</label>
                                省:<input name="province">
                                市:<input name="city">
                                区:<input name="area">
                            </li>
                            <li>
                                <label><span>*</span>详细地址：</label>
                                <input name="address" type="text"  class="xiangxi"/>
                            </li>
                            <li>
                                <label><span></span>邮政编码：</label>
                                <input type="text" name="code" class="youbian"/>
                            </li>
                            <li>
                                <label><span></span>电话：</label>
                                <input type="text" name="phone" class="dianhua"/>
                            </li>
                            <li>
                                <label><span></span>手机号：</label>
                                <input name="telephone" type="text" class="shouji"/></li>
                            <li>
                                <label>&nbsp;</label>
                                <input onclick="submitFormAddress()" type="button" value="增加收货地址"/>
                            </li>
                        </ul>
                    </div>
                </div>--%>
                <!-- 新增收货地址 End -->
            </div>
            <div class="clear"></div>
            <!-- 购物车列表 -->
            <div class="shop_bd_shdz_title">
                <h3>确认购物清单</h3>
            </div>
            <div class="clear"></div>
            <table>
                <thead>
                    <tr>
                        <th colspan="2"><span>商品</span></th>
                        <th><span>单价(元)</span></th>
                        <th><span>数量</span></th>
                        <th><span>小计</span></th>
                        <%--<th><span>操作</span></th>--%>
                    </tr>
                </thead>
                <tbody>

                <c:forEach items="${cartItems}" var="entry">
                    <tr>
                        <td class="gwc_list_pic">
                            <a href="javascript:void(0);">
                                <%--图片--%>
                                <img style="width: 60px;height: 60px" src="${entry.product.main_image}"/>
                            </a>
                        </td>
                        <td class="gwc_list_title">
                            <%--名字--%>
                            <a href="javascript:void(0);">${entry.product.name}</a>
                        </td>
                        <td class="gwc_list_danjia">
                            <%--价格--%>
                            <span>￥<strong id="danjia_001">${entry.product.price}</strong></span>
                        </td>
                        <%--加减：传递给后台，保存在request\model--%>
                        <td class="gwc_list_shuliang">
                            <span>${entry.quantity}</span>
                        </td>
                        <td class="gwc_list_xiaoji">
                            <%--总计--%>
                            <span>￥<strong id="xiaoji_001" class="good_xiaojis">${entry.quantity*entry.product.price}</strong></span>
                        </td>
                        <%--<td class="gwc_list_caozuo">
                            <a style="margin: 0px" href="javascript:void(0);">收藏</a>
                            <a style="margin-left: 5px" href="javascript:void(0);" class="shop_good_delete">删除</a>
                        </td>--%>
                    </tr>
                </c:forEach>

                </tbody>
                <tfoot>
                    <tr>
                        <td colspan="6">
                            <div class="gwc_foot_zongjia">
                                商品总价(不含运费)<span>￥<strong id="good_zongjia">${sum}</strong></span>
                            </div>
                            <div class="clear"></div>
                            <div class="gwc_foot_links">
                                <a href="/render/flow" class="go">返回购物车</a>
                                <a href="/render/myorder" class="op">个人订单</a>
                            </div>
                        </td>
                    </tr>
                </tfoot>
            </table>
            <!-- 购物车列表 End -->

        </div>
    </div>
    <span style="visibility:hidden" class="shipping_id">${shipping_id}</span>
    <!-- 购物车 Body End -->
</form>
<!-- 购物车 Body End -->

<!-- Footer - wll -->
<jsp:include page="common/footer.jsp"></jsp:include>
<!-- Footer End -->

<%--<script type="text/javascript" src="render/js/frontend/jquery_goodnums.js"></script>--%>
<%--<script type="text/javascript" src="render/js/frontend/shop_gouwuche.js"></script>--%>
<script type="text/javascript">
    addressList($(".shipping_id").text());
    var deleteUrl='/render/shipping/delete?id=';
    function addressList(id){
        $.ajax({
            type: 'post',
            url: "/render/shipping/address_id?shipping_id="+id,
            success: function (data) {
                var content = "";
                if (data.success){
                    content += "<li><label>寄送至：<span><input name='did' type='radio' checked='checked' value='" + data.message.id + "'/></span></label><em>" +
                        data.message.receiver_province + "</em><em>" + data.message.receiver_city + "市</em><em>" + data.message.receiver_address
                        + "区</em><em>" + data.message.receiver_district + "</em><em>" + data.message.receiver_name + "(收)</em><em>" + data.message.receiver_mobile + "</em>"
                        +"</li>";
                }
                // $("#address").empty();
                // console.log(data.message);
                $("#address").html(content);
            }
        }, "json");
    }
</script>
</body>
</html>